<!DOCTYPE html>
<html>

<head>
	<meta charset="utf-8">
	<title>优选</title>
	<link rel="stylesheet" href="./css/reset.css">
	<link rel="stylesheet" href="./css/optimization.css">
	<link rel="stylesheet" href="./lib/swiper/css/swiper-bundle.min.css">
	<style>
		.mySwiper_head .swiper-slide:nth-child(n) {
			width: 90%;
		}
		.mySwiper_title .swiper-slide:nth-child(n) {
			width: 80%;
		}
	</style>
</head>

<body>
	<header class="header">
		<div class="header_nav">
			<span class="text">优选</span>
		</div>
		<div class="swiper head_banner">
			<div class="swiper mySwiper_head">
				<div class="swiper-wrapper">
					<div class="swiper-slide">
						<div class="header_banner"><img class="banner" src="./img/optimization/img_03.jpg" alt=""></div>
					</div>
					<div class="swiper-slide">
						<div class="header_banner"><img class="banner" src="./img/optimization/img_03.jpg" alt=""></div>
					</div>
					<div class="swiper-slide">
						<div class="header_banner"><img class="banner" src="./img/optimization/img_03.jpg" alt=""></div>
					</div>
				</div>
			</div>

		</div>

		<ul class="bottom">
			<li><img class="recommend_icon" src="./img/optimization/img_09.jpg" alt="">
				<div class="icon_text">本家推荐</div>
			</li>
			<li><img class="recommend_icon" src="./img/optimization/img_07.jpg" alt="">
				<div class="icon_text">挑选师推荐</div>
			</li>
			<li><img class="recommend_icon" src="./img/optimization/img_12.jpg" alt="">
				<div class="icon_text">私物推荐</div>
			</li>
			<li><img class="recommend_icon" src="./img/optimization/img_14.jpg" alt="">
				<div class="icon_text">本家LOOK</div>
			</li>
		</ul>
	</header>
	<div class="gray_block">
		<div class="background">
			<div class="title">本家甄选</div>
			<div class="select">
				<div class="border">
					<img class="select_banner" src="./img/optimization/img_21.jpg" alt="">
					<div class="title">叠韵滤光器，氛围造型大师</div>
					<div class="another_title">光笼，来自斯德哥尔摩的光晕礼赞</div>
				</div>
			</div>
			<div class="select_list">
				<div class="border">
					<div>
						<div class="title_commodity">编织底双色鞋子 多色可选</div>
						<div class="introduce">透气性好，时尚感强</div>
					</div>
					<div><img class="select_list_img" src="./img/optimization/img_25.jpg" alt=""></div>
				</div>
			</div>
			<div class="select_list">
				<div class="border">
					<div>
						<div class="title_commodity">炻瓷储物罐系列</div>
						<div class="introduce">避光密封 坚韧耐摔 多道工序 匠心制作 拥有更久的赏味期限</div>
					</div>
					<div><img class="select_list_img" src="./img/optimization/img_29.jpg" alt=""></div>
				</div>
			</div>
		</div>
	</div>
	<div class="gray_block">
		<div class="background">
			<div class="title">十点一刻</div>
			<div class="swiper head_banner">
				<div class="swiper mySwiper_title">
					<div class="swiper-wrapper">
						<div class="swiper-slide">
							<div class="header_banner">
								<div class="current_topics_box">

									<img class="current_topics" src="./img/optimization/img_33.jpg" alt="">
								</div>
							</div>
						</div>
						<div class="swiper-slide">
							<div class="header_banner">
								<div class="current_topics_box">

									<img class="current_topics" src="./img/optimization/img_33.jpg" alt="">
								</div>
							</div>
						</div>
						<div class="swiper-slide">
							<div class="header_banner">
								<div class="current_topics_box">

									<img class="current_topics" src="./img/optimization/img_33.jpg" alt="">
								</div>
							</div>
						</div>
					</div>
				</div>

			</div>

		</div>
	</div>
	</div>
	<div class="gray_block">
		<div class="background">
			<div class="title">本家推荐</div>
			<div class="his_recommendation">
				<div class="border">
					<img class="his_recommendation_img" src="./img/optimization/img_37.jpg" alt="">
					<div class="his_recommendation_text">夏季出游必备</div>
					<div class="his_recommendation_content">舒心出行，本家为你推荐的5个tips不能忘</div>
				</div>
			</div>
		</div>
	</div>
	<div class="gray_block">
		<div class="background">
			<div class="title">本家LOOK</div>
		</div>
	</div>
	<div class="gray_block">
		<div class="honke_look">
			<div><img class="honke_look_img_big" src="./img/optimization/img_40.jpg" alt=""></div>
			<div>
				<div><img class="honke_look_small" src="./img/optimization/img_42.jpg" alt=""></div>
				<div><img class="honke_look_small" src="./img/optimization/img_46.jpg" alt=""></div>
			</div>
		</div>
		<div class="honke_look_text">给牛仔加点火山岩</div>
	</div>

	<div class="gray_block">
		<div class="honke_look">
			<div><img class="honke_look_img_big" src="./img/optimization/img_50.jpg" alt=""></div>
			<div>
				<div><img class="honke_look_small" src="./img/optimization/img_53.jpg" alt=""></div>
				<div><img class="honke_look_small" src="./img/optimization/img_55.jpg" alt=""></div>
			</div>
		</div>
		<div class="honke_look_text">婚纱拍照必看功课</div>
	</div>
	<div class="gray_block">
		<div class="honke_look">
			<div><img class="honke_look_img_sola" src="./img/optimization/img_58.jpg" alt=""></div>
		</div>
		<div class="honke_look_text">夏天的清凉，多亏了这抹茶绿</div>
	</div>
	<div class="gray_block">
		<div class="honke_look">
			<div><img class="honke_look_img_big" src="./img/optimization/img_60.jpg" alt=""></div>
			<div>
				<div><img class="honke_look_small" src="./img/optimization/img_62.jpg" alt=""></div>
				<div><img class="honke_look_small" src="./img/optimization/img_65.jpg" alt=""></div>
			</div>
		</div>
		<div class="honke_look_text">你的厨房只是少了它</div>
	</div>
	<div class="gray_block">
		<div class="honke_look">
			<div><img class="honke_look_img_sola" src="./img/optimization/img_69.jpg" alt=""></div>
		</div>
		<div class="honke_look_text">家的精致主义</div>
	</div>
	<div class="gray_block">
		<div class="honke_look">
			<div><img class="honke_look_img_sola" src="./img/optimization/img_72.jpg" alt=""></div>
		</div>
		<div class="honke_look_text">收纳，让小家越住越大</div>
		   
	</div>
	<div class="bottom_fixed">
		<div class="fixed_bottom">
			<a href="index.html"><div class="item"><img src="./img/optimization/1.png" alt="">
				<div>首页</div>
			</div></a>
			<a href="optimization.html"><div class="item"><img src="./img/optimization/2.png" alt="">
				<div>优选</div>
			</div></a>
			<a href="classify.html"><div class="item"><img src="./img/optimization/3.png" alt="">
				<div>分类</div>
			</div></a>
			<a href="shopping_trolley.html"><div class="item"><img src="./img/optimization/4.png" alt="">
				<div>购物车</div>
			</div></a>
			<a href="personal_center.html"><div class="item"><img src="./img/optimization/5.png" alt="">
				<div>我的</div>
			</div></a>
		</div>
	</div>
	</div>
	<div class="up_arrow"><img src="./img/home/img_06.png" alt=""></div>
	<script src="./lib/swiper/js/swiper-bundle.min.js"></script>
	<script>
		var swiper = new Swiper(".mySwiper_head", {
			slidesPerView: "auto",
			spaceBetween: 30,
			pagination: {
				el: ".swiper-pagination",
				clickable: true,
			},
		});
		var swiper = new Swiper(".mySwiper_title", {
			slidesPerView: "auto",
			spaceBetween: 30,
			pagination: {
				el: ".swiper-pagination",
				clickable: true,
			},
		});
		
	</script>
</body>

</html>